import React from "react";
import {Study} from "./style";


export default class Index extends React.PureComponent {
  constructor(prop, state) {
    super(prop);
    this.state = {
      isShow: true
    };
  }
  showPop() {
    this.setState({
      isShow: true
    });
  }
  hidePop() {
    this.setState({
      isShow: false
    });
  }
  render() {
    return (
      <Study>
        <ul>
          <li>
            <div className="tu">
              <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1557119220920&di=246be123f5722f58b6f62e5c94ebf47e&imgtype=0&src=http%3A%2F%2Fimg17.3lian.com%2Fd%2Ffile%2F201702%2F20%2Fec4acb80b76b3e84fe58f48b558908d3.jpg" alt=""/>
              <p>已学习：10天</p>
            </div>
            <div className="hidden">
              <h2>这里是不是要有课名</h2>
              <div className="info">
                <span>总课时：20</span>
                <span>总时长数：2小时10分钟</span>
              </div>
              <div className="info">
                <span>已完成：10</span>
                <span>完成时长数：1小时05分</span>
              </div>
              <div className="wcd">
                视频学习完成度
                <span><i style={{width: '50%'}}></i></span>50%
              </div>
              <div className="wcd">
                课后习题完成度
                <span><i style={{width: '40%'}}></i></span>40%
              </div>
            </div>
          </li>
        </ul>
        {/* <PopUp className={this.state.isShow ? "show" : ""}>
            <div className="content">
                <h2>学习奖励说明</h2>
                <p>
                完整观看一个专业视频，可获0.5元心意奖；答对一道专业题目，可获0.5元心意奖；（提现可联系客服）学习完视频并且答对每道专业题，可获得职业“推荐人”特权,赚取每瓶产品的差价以及发展团队。
                </p>
                <b onClick={this.hidePop.bind(this)}>确定</b>
                <i className="iconfont" onClick={this.hidePop.bind(this)}>
                  &#xe628;
                </i>
            </div>
        </PopUp> */}
      </Study>
    );
  }
}
